<!--
 * @Author: your name
 * @Date: 2022-03-30 20:48:41
 * @LastEditTime: 2022-03-30 21:06:54
 * @LastEditors: Please set LastEditors
 * @Description: 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
 * @FilePath: \edu-web\src\views\About.vue
-->
<template>
  <div>
    <sub-header pathName="/about" :tab="tab"></sub-header>
    <div class="clearfix"></div>
    <about-introduce v-if="tab == 1"></about-introduce>
    <welcome v-else></welcome>
  </div>
</template>
<script>
import SubHeader from '@/components/subHeader/subHeader.vue'
import AboutIntroduce from './About/AboutIntroduce.vue'
import Welcome from './About/Welcome.vue'

export default {
  components: {
    'sub-header': SubHeader,
    'about-introduce': AboutIntroduce,
    'welcome': Welcome
  },
  data() {
    return {
      tab: 1
    }
  },
  watch: {
    $route(to) {
      if (to.name == 'About' && to.query.tab) {
        this.tab = +to.query.tab
      }
    },
  },
  created() {
    if (this.$route.query && this.$route.query.tab == 2) {
      this.tab = 2
    }
  },
  mounted() {
  },
  methods: {
    async getAboutData() {
      await this.getCateData()
    }
  },
}
</script>
<style>
.category_title {
  /* width: 180px; */
  margin: 0px auto;
  text-align: center;
}

.category_title h2 {
  color: #233876;
  font-size: 22px;
  font-weight: normal;
}

.category_title h3 {
  color: #aaa;
  font-size: 14px;
  font-weight: normal;
  margin-top: 7px;
}

.rybody {
  margin-top: 42px;
}

.rybody p {
  text-indent: 2em;
  line-height: 26px;
  letter-spacing: 1px;
}

.rybody .catpic1 {
  border-top: 1px solid #eee;
  padding: 4px 0px;
  margin-bottom: 15px;
  border-bottom: 1px solid #eee;
  text-align: center;
}

.rybody .catpic1 img {
  display: inline-block;
  width: 100%;
}
</style>